@import url(common.css);
*{
    padding: 0;
    margin: 0;
}
body{
    min-width: 320px;
    max-width: 750px;
    width: 15rem;
    margin: 0 auto;
    line-height: 1.5;
    font-family: Arial, Helvetica;
    background-color: #F2F2F2;
}
@basefont:50;
.footer-search{
    width: 15rem;
    position: fixed;
    min-width: 320px;
    max-width: 750px;
    top: 0;
    left: 50%;
    transform: translate(-50%);
    height: (88rem/@basefont);
    background-color: #ffc001;
    display: flex;
    >.classify{
        width: (44rem/@basefont);
        height: (88rem/@basefont);
        margin: (11rem/@basefont) (23rem/@basefont) (7rem/@basefont) (25rem/@basefont);
        background: url(../images/classify.png) no-repeat;
        background-size: 100% auto;
    }
    >.search{
        flex: 1;
        >input{
            font-size: (12rem/@basefont);
            height: (66rem/@basefont);
            width: 100%;
            box-sizing: border-box;
            color: #ccc;
            border: none;
            outline: none;
            padding-left: (32rem/@basefont);
            border-radius: (33rem/@basefont);
        }
    }
    >.login{
        line-height: (88rem/@basefont);
        margin-left: (22rem/@basefont);
        margin-right: (22rem/@basefont);
        font-size: (26rem/@basefont);
        color: white;
    }
}
.focus{
    display: flex;
    width: 15rem;
    flex-wrap: wrap;
    >.focus_long{
        width: 15rem;
        height: (368rem/@basefont);
        flex: 100%;
        background: url(../images/banner.gif) no-repeat;
        background-size: 100% auto;
    }
    >.focus_imgs{
        overflow: hidden;
        width: 15rem;
        display: flex;
        >div:nth-child(1){
            width: 5rem;
            height: (240rem/@basefont);
            background: url(../images/ad1.gif) no-repeat;
            background-size: 100% auto;
        }
        >div:nth-child(2){
            width: 5rem;
            height: (240rem/@basefont);
            background: url(../images/ad2.gif) no-repeat;
            background-size: 100% auto;
        }
        >div:nth-child(3){
            width: 5rem;
            height: (240rem/@basefont);
            background: url(../images/ad3.gif) no-repeat;
            background-size: 100% auto;
        }
    }
}
.subnav_entry{
    width: 15rem;
    max-width: 750px;
    min-width: 350px;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    >li{
        flex: 20%;
        font-size: (16rem/@basefont);
        height: (120rem/@basefont);
        text-align: center;
        display: flex;
        flex-direction: column;
        >a{
            color: black;
            display: flex;
            flex-direction: column;
            align-items: center;
            >span:first-child{
                width: (80rem/@basefont);
                height:(80rem/@basefont);
                background: url(../images/nav1.png) no-repeat;
                background-size:100% auto;
                padding-bottom: 10px;
            }
        }
    }
}